<template>
	<div>
		<div style="height:40px;line-height:40px">
			<!--<b>监测点：{{ItemName}}</b> =>-->
			{{ItemName}}
			<div style="float:right;" v-if="['查看模板','模板审核','任务详情','任务签发'].indexOf(title)<0">
				<el-button type="primary" size="mini" :disabled="addDisable || sampleObj.isDisabled" @click="addPoint">添加项目</el-button>
				<el-button type="primary" size="mini" :disabled="editDisable" @click="isshowsetCheckMan=true">设置人员</el-button>
				<!--<el-button type="primary" size="mini" :disabled="editDisable" @click="setfenbao">设置分包商</el-button>-->
				<el-button type="primary" size="mini" :disabled="addDisable" @click="setfenbaoNew">添加分包</el-button>
			</div>
		</div>
		<el-table :data="newTestDate" style="width: 100%;" size="mini" v-if="showTestItem" :height="tableHeightC" :cell-class-name="cellClassName"
		 :row-class-name="rowClassName" highlight-current-row @selection-change="handleSelectionChange" class='tableColor'>
			<el-table-column type="selection" :selectable='selectInit' min-width="38px" key="selection" v-if="['查看模板','任务详情','任务签发'].indexOf(title)<0"
			 fixed>
			</el-table-column>
			<el-table-column min-width="38px" label="序号" fixed>
				<template slot-scope="scope">
					{{scope.$index+1}}
				</template>
			</el-table-column>
			<el-table-column property="itemNames" label="检测项目" min-width="120px" show-overflow-tooltip>

			</el-table-column>
			<el-table-column min-width="120px" property="detectabilityName" show-overflow-tooltip label="能力参数">
			</el-table-column>
      <el-table-column min-width="80px" property="version" show-overflow-tooltip label="版本号">
      </el-table-column>
			<el-table-column min-width="80px" property="analystName" label="检测人员" show-overflow-tooltip :formatter="util.tableFormatter">
			</el-table-column>
			<el-table-column property="subcontractorName" v-if="!isBD" min-width="80px" label="分包商" show-overflow-tooltip :formatter="util.tableFormatter">
			</el-table-column>
			<el-table-column label="操作" min-width="100px" fixed="right" key="edit" v-if="['查看模板','模板审核','任务详情','任务签发'].indexOf(title)<0">
				<template slot-scope="scope">
					<el-button type="text" size="mini" @click="editRow(scope.row)" :disabled="((getPlanData.status == 4 || getPlanData.status == 502) && scope.row.status > 551) || sampleObj.isDisabled">编辑</el-button>
					<el-button type="text" size="mini" @click="deleteRow(scope.row,scope.$index)" :disabled="(getPlanData.status == 4 || getPlanData.status == 502) && scope.row.status > 551 ">删除</el-button>

				</template>
			</el-table-column>
		</el-table>

		<setCheckMan :showsetCheckMan.sync="isshowsetCheckMan" :selectedArr.sync="monitorPoints"></setCheckMan>
		<!--原来的设置分包商-->
		<setSubcontractor :showsetSubcontractor.sync="issetSubcontractor" :selectedArr.sync="monitorPoints"></setSubcontractor>
		<!--现在的设置分包商-->
		<setSubNew :showsetSubcontractor.sync="issetSubNew" :getPlanData.sync="getPlanData"></setSubNew>
		<addTestItem :showAddpoint.sync="isShowAddpoint" :addPointTitle.sync="addPointTitle" :sampleForm.sync="sampleForm" :getPlanData.sync="getPlanData"></addTestItem>
		<editTestItem :showEditpoint.sync="isShowEditpoint" :editRowItem.sync="editRowItem" ></editTestItem>
	</div>
</template>

<script>
	import { mapState } from 'vuex'

	import setCheckMan from './dialog/setCheckMan.vue'
	import setSubcontractor from './dialog/setSubcontractor.vue'
	import addTestItem from './dialog/addTestItem.vue'
	import editTestItem from './dialog/editTestItem.vue'
	import setSubNew from './dialog/setSubNew.vue'

	export default {
		components: {
			setCheckMan,
			setSubcontractor,
			addTestItem,
			editTestItem,
			setSubNew
		},
		props: ['title', 'getPlanData'],
		data() {
			return {
				showTestItem: true,
				addPointTitle: '',
				sampleForm: {},
				isShowAddpoint: false,
				isShowEditpoint: false,
				issetSubcontractor: false,
				isshowsetCheckMan: false,
				monitorPoints: [],
				editDisable: true,
				addDisable: true,
				newTestDate: [],
				ItemName: '',
				editRowItem: {},
				issetSubNew:false,
				sampleObj:{},
			}
		},
		computed: {
			...mapState(['status', 'isBD',]),
			tableHeightC(){
				return ((window.innerHeight - 300) / 2 - 5) //有上下两个表格
			}
		},
		created() {
			this.$root.eventHub.$on("sample2brother", passData => {
				// console.log(passData)
				this.newTestDate = passData.detectBeans
				this.ItemName = passData.name
				this.addDisable = false
				this.sampleObj = passData
				this.$set(this.sampleObj,'isDisabled',false)
        console.log(this.sampleObj)
				// 子样不能添加和编辑
				for(var i in this.getPlanData.sampleBeans){ //找到改样品的子样
					var obj = this.getPlanData.sampleBeans[i];
          // 找到质控样
					if(this.sampleObj.parent != undefined && this.sampleObj.parent == obj.parent && this.sampleObj.qcType != undefined && this.sampleObj.qcType != null && this.sampleObj.qcType != ''){
						// 找到有有父样的质控样
            if(this.sampleObj.group == 1 ){
               this.$set(this.sampleObj,'isDisabled',true)
            }

					}
				}
			})
		},
		methods: {
			selectInit(row, index) { //
				if (this.getPlanData.status == 502) {// 如果任务状态时检测中的话，才需要控制样品状态
					// 待领取状态之后的 不可设置 编辑 删除
					if (row.status > 551) {
						return false  //不可勾选
					} else {
						return true  //可勾选
					}
				}else{
					return true  //可勾选
				}
			},
			rowClassName({ row, rowIndex }) {
				//只有待签发的时候的才会显示不同的颜色
				if (this.getPlanData.status == "501") {
					// 1代表新增
					if (row.updateFlag == 1) {
						return 'colorgreen'
					}
					// 2代表删除
					if (row.updateFlag == 2) {
						return 'colorgrey'
					}
					// 3代表修改
					// if (row.updateFlag == 31 || row.updateFlag == 32 || row.updateFlag == 33) {
					// 	return 'colorBlue'
					// }
				}

			},
			cellClassName({ row, column, rowIndex, columnIndex }) {
				if (this.getPlanData.status == "501") {
					if (row.updateFlag == 31 && columnIndex == 1) {
						return 'colorBlue'
					}
					if (row.updateFlag == 32 && columnIndex == 3) {
						return 'colorBlue'
					}
					if (row.updateFlag == 33 && columnIndex == 4) {
						return 'colorBlue'
					}
				}
			},

			reload() {
				this.showTestItem = false;
				this.$nextTick(() => {
					this.showTestItem = true;
				})
				this.monitorPoints = [];
			},
			setfenbao() {
				this.issetSubcontractor = true
			},
			setfenbaoNew(){
				this.issetSubNew = true;
			},
			handleSelectionChange(val) {
				this.monitorPoints = val;
			},
			editRow(row) {
				this.editRowItem = row;
				this.isShowEditpoint = true;

			},
			deleteRow(row,index) {
				// getPlanData
        console.log(this.newTestDate,this.sampleObj)
				this.newTestDate.splice(index, 1);


				for(var i in this.getPlanData.sampleBeans){ //找到改样品的子样
					var obj = this.getPlanData.sampleBeans[i];
          // debugger;
					if(this.sampleObj.id != obj.id && this.sampleObj.parent == obj.parent && obj.qcType != undefined && obj.qcType != null && obj.qcType != ''){
            console.log(obj)
						for(var j in obj.detectBeans){
							if(obj.detectBeans[j].detectability == row.detectability){
								obj.detectBeans.splice(j,1)
							}
						}
					}
				}

				// 如果是采样调用
				// if (this.getPlanData.source == 0) {
				// 	this.changeMaterial()
				// }

			},
			changeMaterial() {
				let planItemBeans = this.newTestDate
				let params = planItemBeans.map((item) => {
					return {
						detectability: item.detectability
					}
				})
				// this.$parent.$parent.planHandleBottle(params).then((res) => {
				// 	this.$parent.$parent.$refs.material.caiyangData = res.data
				// })
			},
			addPoint() {
				console.log(this.newTestDate)
				if(this.newTestDate == undefined){
					this.$message({
						type:'info',
						message:"请选中监测点"
					})
					return;
				}
				this.addPointTitle = '添加'
				this.isShowAddpoint = true;
				this.sampleForm = {
					"analyst": "",
					"item": "",
					"subcontractor": "",
					"subcontractorName": "",
				}
			},
			editPoint(row) {
				this.sampleForm = row
				this.addPointTitle = '更改'
				this.isShowAddpoint = true;
			},
		},
		watch: {
			monitorPoints: {
				handler: function (newValue, oldValue) {

					if (this.monitorPoints.length != 0) {
						this.editDisable = false
					} else {
						this.editDisable = true
					}
				},
				deep: true
			}
		}
	}

</script>

<style>
	.tableColor .colorgreen {
		color: aqua;
	}

	.tableColor .colorgrey {
		color: #ccc;
	}

	.tableColor .colorBlue {
		color: #409eff
	}
</style>
